//订单列表
import React, { Component } from 'react'
import { Tabs, Empty, Modal, message, Tag, Tooltip } from "antd";
import { ExclamationCircleOutlined } from '@ant-design/icons';
import TheButton from '@/components/TheButton';
import ThePagination from '@/components/ThePagination';
import TheQueryForm from '@/components/TheQueryForm';
import DistributionServe from './components/distributionServe'
import { getDateTime3 } from '@/utils/getDate'
import Json2Excel from '@/utils/Json2Excel'
import './style/style.scss'
import ServeTableModal from './components/serveTableModal'
import store from "@/store/store"
import _ from 'lodash'
import { callOrderPage, callOrderExport, allocationSingle, allocationWhole, clearAllocation, getAreaTree, callCloseServicerOrder } from '@/request/callOrder/orderList.js'
export default class OrderList extends Component {
  constructor() {
    super()
    this.state = {
      orderStatus: '', //tab值
      tabValueData: [
        { tab: '全部', key: '' },
        { tab: '待付款', key: 'WAIT_PAY' },
        { tab: '待分配', key: 'WAIT_ORDER_TAKING' },
        { tab: '待服务', key: 'WAIT_SERVICE' },
        { tab: '服务中', key: 'IN_PROCESS' },
        { tab: '已完成', key: 'FINISH' },
        { tab: '已关闭', key: 'CLOSE' },
      ], //tab内容
      searchOption: [
        { field: 'orderId', label: '订单编号', placeholder: '请输入订单编号', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'time', label: '下单时间', required: false, rules: [], type: 'RangePicker', defaultValue: '' },
        {
          field: 'serviceType',
          label: '服务类型',
          placeholder: '全部',
          type: 'Select',
          options: [
            { label: '全部', value: '' },
            { label: '喂养', value: 'FEED' },
            { label: '洗护', value: 'CARE' },
          ],
          defaultValue: ''
        },
        {
          field: 'allocationStatus', label: '分配状态', placeholder: '全部', type: 'Select',
          options: [
            { label: '全部', value: '' },
            { label: '已分配', value: 'ASSIGNED' },
            { label: '待分配', value: 'NON_ASSIGNED' },
          ],
          defaultValue: ''
        },
        { field: 'userInfo', label: '宠主姓名/ID', placeholder: '请输入宠主姓名/ID', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'userMobile', label: '宠主电话', placeholder: '请输入宠主电话', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'servicerInfo', label: '服务者姓名/ID', placeholder: '请输入服务者姓名/ID', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'servicerMobile', label: '服务者电话', placeholder: '请输入服务者电话', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'address', label: '省份/城市/区县', placeholder: '请选择省份/城市/区县', required: false, rules: [], type: 'Cascader', defaultValue: '', option: [], },
      ],
      queryForm: {},
      dataSource: [], //表格数据
      pageData: {
        pageNo: 1,
        pageSize: 10
      },
      total: 0,
      isDurationModal: false,//整单分配、分配弹窗
      selectServeId: [],//勾选的服务者id
      exportBtnLoading: false,//导出loading
      allotFlag: null,//整单分配是否显示
      tableAllOtFlag: null,//订单行分配按钮是否显示
      allocationType: '',//分配方式 整单分配whole 单行分配single
      orderId: undefined,// 整单订单id
      orderDetailId: undefined,//订单行id
      submitAllotBtnLoading: false,//确认分配按钮loading
      version: null,//订单版本号
      orderInfo: null, // 整体订单信息数据
      serviceData: [],//服务者list
      isServeListModal: false,//已分配的服务者信息弹窗
    }
  }
  componentDidMount() {
    let searchParams = store.getState().searchValue
    let { pageNo, pageSize, queryForm, orderStatus, pathName } = searchParams
    if (searchParams && pageNo && pathName == 'OrderList') {
      this.setState({
        queryForm, pageData: { pageNo, pageSize }, orderStatus
      }, () => {
        this.queryFormRef.onSetDefault({ ...queryForm })
        this.getData({ ...queryForm })
      })
    } else {
      this.getData()
    }
    this.getAreaTreeList()
  }
  //获取数据
  getData = async (values) => {
    let { pageData, queryForm, orderStatus } = this.state
    if (values && !_.isEmpty(values.times)) {
      values.createTimeStart = getDateTime3(values.times[0]) + " 00:00:00"
      values.createTimeEnd = getDateTime3(values.times[1]) + " 23:59:59"
      delete values.times
    }
    if (values && !_.isEmpty(values.address)) {
      if (values.address.length && values.address.length === 1) {
        values.province = values.address[0]
      } else {
        values.province = values.address[0]
        values.city = values.address[1]
        values.district = values.address[2]
      }
      delete values.address
    }
    this.setState({
      queryForm: values === undefined ? this.state.queryForm : { ...values }
    }, async () => {
      let params = { orderStatus, ...pageData, queryForm: this.state.queryForm }
      store.dispatch({
        type: 'SaveSearchValues',
        data: { pathName: 'OrderList', ...params }
      })
      let res = await callOrderPage({ orderStatus, ...pageData, ...values })
      if (res.code === 0) {
        this.setState({
          dataSource: res.data,
          pageData: { pageNo: res.pageNo, pageSize: res.pageSize },
          total: res.totalCount
        })
      }
    })
  }
  getAreaTreeList = async () => {
    let { searchOption } = this.state
    let res = await getAreaTree()
    if (res.code === 0) {
      let arr = res.data.map(item => {
        return {
          label: item.label,
          value: item.label,
          children: item.children.map(city => {
            return {
              label: city.label,
              value: city.label,
              children: city.children.map(dis => {
                return {
                  label: dis.label,
                  value: dis.label
                }
              })
            }
          })
        }
      })
      searchOption[8].option = arr
    }
    this.setState({ searchOption })
  }
  //切换标签页Tabs
  tabChange = (value) => {
    this.setState({ orderStatus: value }, async () => { await this.pageChange(1, 10) })
  }
  //切换分页
  pageChange = (pageNo, pageSize) => {
    this.setState({
      pageData: { pageNo, pageSize }
    }, async () => {
      await this.getData(this.state.queryForm)
    })
  }
  //搜索
  onFormSearch(values) {
    if (values && values.hasOwnProperty('time')) {
      values.beginOrderCreateTime = values.time[0].format('YYYY-MM-DD') + ' 00:00:00'
      values.endOrderCreateTime = values.time[1].format('YYYY-MM-DD') + ' 23:59:59'
      delete values.time
    }
    this.setState({
      pageData: { pageNo: 1, pageSize: 10 }
    }, () => {
      this.getData(values)
    })
  }
  //搜索重置
  onReset() {
    this.setState({ queryForm: {} }, () => {
      this.pageChange(1, 10)
    })
  }
  //服务者列表值
  getServerData = (value) => {
    if (value) {
      this.setState({ serviceData: value })
    }
  }
  //分配服务者弹窗
  distributionModal = (value, allocationType, orderInfo) => {
    //订单状态 orderStatus 枚举值 WAIT_PAY 待付款 WAIT_ORDER_TAKING 待接单 WAIT_SERVICE 待服务 IN_PROCESS 服务中 FINISH 已完成 CLOSE 已关闭
    if (value) {
      // 整单分配操作
      if (allocationType === 'whole') {
        value.orderDetailList.map(item => {
          // allocationNewArr： 已分配订单行数组  过滤出订单行中包含 WAIT_SERVICE 待服务 IN_PROCESS 服务中 FINISH 已完成 的数据 
          let allocationNewArr = value.orderDetailList.filter(v => v.orderStatus === 'WAIT_SERVICE' || v.orderStatus === 'IN_PROCESS' || v.orderStatus === 'FINISH')
          if (allocationNewArr && allocationNewArr.length > 0) {
            return message.error('当前订单已有单行服务已分配，无法整单分配！')
          } else {
            // 所有订单行订单 不存在以进行单行分配直接打开服务者弹窗 否则提示弹窗是否继续分配
            this.setState({ isDurationModal: true, allocationType, orderId: value.orderId, version: value.version })
          }
        })
        return
      }
      if (allocationType === 'single') {
        this.setState({ isDurationModal: true, allocationType, orderId: value.orderId, version: orderInfo.version, orderDetailId: value.orderDetailId, orderInfo, orderInfoDetails: value })
        return
      }
    }
  }
  // 勾选的服务者id集合
  selectServe = (selectServicerIds) => {
    this.setState({ selectServicerIds })
  }
  // 确认分配服务者
  submitDistribution = async () => {
    let { selectServicerIds, orderId, orderDetailId, allocationType, version } = this.state
    // 没有选择服务者时 点击分配提示
    if (selectServicerIds === undefined || selectServicerIds.length === 0) { return message.warning('请至少选择一位服务者！') }
    this.setState({ submitAllotBtnLoading: true })
    if (allocationType === 'single') {
      let res = await allocationSingle({ servicerIds: selectServicerIds, userOrderId: orderId, userOrderDetailId: orderDetailId, version })
      if (res.code === 0) {
        message.success('分配成功！')
        this.setState({ isDurationModal: false, selectServicerIds: [] }, () => {
          this.getData()
        })
        // window.location.reload() //分配成功后刷新下页面
        return
      }
      if (res.code === 20008) {
        Modal.confirm({
          title: '提醒',
          icon: <ExclamationCircleOutlined />,
          content: '当前订单已进行过整单分配，需取消原先的整单分配方可进行的单行分配，是否取消原先的整单分配，继续单行分配',
          okText: '继续',
          cancelText: '取消',
          onOk: async () => {
            let res = await clearAllocation({ userOrderId: orderId, version })
            if (res.code === 0) {
              let res = await allocationSingle({ servicerIds: selectServicerIds, userOrderId: orderId, userOrderDetailId: orderDetailId, version })
              if (res.code === 0) {
                message.success('分配成功！')
                this.setState({ isDurationModal: false, selectServicerIds: [] }, () => {
                  this.getData()
                })
                // window.location.reload() //分配成功后刷新下页面
              }
            }
          }
        })
        return
      }
    } else if (allocationType === 'whole') {
      let res = await allocationWhole({ servicerIds: selectServicerIds, userOrderId: orderId, version })
      if (res.code === 0) {
        message.success('分配成功！')
        this.setState({ isDurationModal: false, selectServicerIds: [] }, () => {
          this.getData()
        })
        // window.location.reload() //分配成功后刷新下页面
        return
      }
      if (res.code === 20008) {
        Modal.confirm({
          title: '提醒',
          icon: <ExclamationCircleOutlined />,
          content: '当前订单已进行过单行分配，需取消原先的单行分配方可进行的整单分配，是否取消原先的单行分配，继续整单分配',
          okText: '继续',
          cancelText: '取消',
          onOk: async () => {
            let res = await clearAllocation({ userOrderId: orderId, version })
            if (res.code === 0) {
              let res = await allocationWhole({ servicerIds: selectServicerIds, userOrderId: orderId, version })
              if (res.code === 0) {
                message.success('分配成功！')
                this.setState({ isDurationModal: false, selectServicerIds: [] }, () => {
                  this.getData()
                })
                // window.location.reload() //分配成功后刷新下页面
              }
            }
          }
        })
        return
      }
    }
    this.setState({ submitAllotBtnLoading: false })
  }
  //导出订单 必须根据搜索条件导出 搜索条件不能为空
  orderExport = async () => {
    const { queryForm, orderStatus } = this.state
    if (!queryForm || Object.keys(queryForm).length === 0) {
      Modal.warning({
        title: '提示',
        content: '请选择筛选条件并查询后再导出对应的订单，暂不支持全量导出',
        okText: "我知道了"
      })
      return
    }
    this.setState({ exportBtnLoading: true })
    let tB_data = []
    let res = await callOrderExport({ ...queryForm, orderStatus })
    if (res.code === 0) {
      tB_data = res.data.map(item => {
        let serviceType = '', payChannel = '', orderStatus = '', refundStatus = '', changeStatus = '', btn = '', skuInfoValue = [] //规格信息数据值 规格值可能会存在多个 多个情况下、分隔显示
        //支付方式
        switch (item.payChannel) {
          case 'WECHAT':
            payChannel = '微信'
            break;
          case 'ALI':
            payChannel = '支付宝'
            break;
          default:
            payChannel = "-"
        }
        //订单状态
        switch (item.orderStatus) {
          case 'WAIT_PAY':
            orderStatus = '待付款'
            break
          case 'WAIT_ORDER_TAKING':
            orderStatus = '待接单'
            break
          case 'WAIT_SERVICE':
            orderStatus = '待服务'
            break
          case 'IN_PROCESS':
            orderStatus = '服务中'
            break
          case 'FINISH':
            orderStatus = '已完成'
            break
          case 'CLOSE':
            orderStatus = '已关闭'
            break
          default:
            orderStatus = '-'
        }
        //退款、变更订单数据详情
        if (item.salesReturnDetailList) {
          item.salesReturnDetailList.map(v => {
            //refundStatus 退款枚举值   path 跳转地址
            switch (v.refundStatus) {
              case '1':
                refundStatus = '待处理'
                break
              case '2':
                refundStatus = '退款成功'
                break
              case '3':
                refundStatus = '退款失败'
                break
              case '0':
                refundStatus = '退款关闭'
                break
              default:
                refundStatus = '-'
            }
            //changeStatus 售后枚举值
            switch (v.changeStatus) {
              case '1':
                changeStatus = '待处理'
                break
              case '2':
                changeStatus = '变更成功'
                break
              case '0':
                changeStatus = '变更关闭'
                break
              default:
                changeStatus = '-'
            }
            switch (v.refundDetailType) {
              case '0':
                btn = changeStatus
                break
              case '1':
                btn = changeStatus
                break
              case '2':
                btn = refundStatus
                break
            }
          })
        }
        if (item.skuInfoObj) {
          if (item.skuInfoObj.specValues) {
            skuInfoValue = item.skuInfoObj.specValues.map(v => {
              return v.specsValue
            }).join('/')
          }
          if (item.skuInfoObj.serviceType) {
            // 服务类型
            switch (item.skuInfoObj.serviceType) {
              case 'FEED':
                serviceType = '喂养'
                break
              case 'CARE':
                serviceType = '洗护'
                break
              default:
                serviceType = '-'
            }
          }
        }
        return {
          ...item,
          service: serviceType + '|' + skuInfoValue, //服务类型+服务的规格信息
          address: item.province + item.city + item.district + item.address, //服务地址省市区详细地址拼接
          serviceTime: item.serviceDate + ' ' + item.serviceWeek + ' ' + item.serviceFinishTime + '~' + item.serviceStartTime, //服务时间 日期 星期 开始结束时间
          payChannel, // 支付方式
          servicerName: item.servicerName ? item.servicerName : '-', //服务者姓名
          orderCreateTime: item.orderCreateTime ? item.orderCreateTime : '-',//下单时间
          orderAmount: item.orderAmount ? React.$transNum(item.orderAmount, 2, -2) : '0.00', //金额
          payAmount: item.payAmount ? React.$transNum(item.payAmount, 2, -2) : '0.00', //实付金额
          orderStatus, //订单状态
          salesReturn: item.salesReturnDetailList ? btn : '-' //变更、退款状态
        }
      })
      const option = {
        header: [
          { prop: 'orderId', title: '订单编号', width: 23 },
          { prop: 'userName', title: '宠主姓名', width: 15 },
          { prop: 'userMobile', title: '宠主电话', width: 15 },
          { prop: 'address', title: '服务地址', width: 25 },
          { prop: 'payChannel', title: '支付方式', width: 15 },
          { prop: 'service', title: '服务', width: 25 },
          { prop: 'serviceTime', title: '服务时间', width: 25 },
          { prop: 'orderAmount', title: '金额(元)', width: 10 },
          { prop: 'payAmount', title: '实付金额(元)', width: 10 },
          { prop: 'orderCreateTime', title: '下单时间', width: 25 },
          { prop: 'servicerName', title: '服务者', width: 15 },
          { prop: 'salesReturn', title: '退款/变更', width: 15 },
          { prop: 'orderStatus', title: '订单行状态', width: 15 },
        ],
        dataSource: tB_data,
        fileName: '订单列表'
      }
      Json2Excel(option)
    }
    this.setState({ exportBtnLoading: false })
  }
  //分配信息弹窗
  getServerListModal = async (value) => {
    this.setState({ isServeListModal: value })

  }
  //已分配 分配信息弹窗
  allocationModal = async (value) => {
    if (value) {
      this.setState({ isAllocationModal: true, allocationType: value.allocationType, orderId: value.orderId, orderDetailId: value.orderDetailId })
    }
  }
  // 退款变更跳转地址
  afterSaleDetails = (path) => {
    if (path && path !== '') {
      this.props.history.push(path)
    }
  }

  anewDistribution = (value, allocationType, orderInfo) => {
    React.$confirm({
      title: "提示",
      okText: "继续",
      type: 'warning',
      content: "当前订单已有服务者接单，请确认该服务者是否无法继续服务，需要变更服务者接单？",
      onOk: async () => {
        let res = await callCloseServicerOrder({ id: value.orderDetailId })
        if (res.code === 0) {
          this.distributionModal(value, allocationType, orderInfo)
        }
      },
      onCancel: async () => {

      }
    });
  }

  render() {
    const { orderStatus, tabValueData, dataSource, pageData: { pageNo, pageSize }, isServeListModal, total, searchOption, isDurationModal, orderDetailId, allocationType, orderId } = this.state
    return (
      <div className="p-layout-box">
        <TheQueryForm ref={(ref) => this.queryFormRef = ref} option={searchOption} show={true}
          onReset={() => this.onReset()}
          onGetValues={(values) => this.onFormSearch(values)} >
          <TheButton haspermi={['call:orderList:export']} size="middle" onClick={() => this.orderExport()} type="default">导出</TheButton>
        </TheQueryForm>
        <Tabs onChange={this.tabChange} activeKey={orderStatus}>
          {
            tabValueData.map((item, index) => {
              return (
                <Tabs.TabPane tab={item.tab} key={item.key}>
                  <table key={index} style={{ width: "100%", lineHeight: "40px", overflowX: "scroll" }}>
                    <thead style={{ textAlign: "center", background: "#f2f2f2" }} >
                      <td width={200}>服务</td>
                      <td width={300}>服务时间</td>
                      <td>金额(元)</td>
                      <td>实付金额(元)</td>
                      <td>分配状态</td>
                      <td>服务者</td>
                      <td>退款/变更</td>
                      <td>状态</td>
                      <td>操作</td>
                    </thead>
                    <div style={{ height: 10 }}></div>
                    {dataSource && dataSource.map(v => {
                      let allotFlag = null //整单分配是否显示
                      let newOrderStatusArr = [] //过滤出订单行包含订单状态是待接单状态的数据
                      if (v.orderDetailList) {
                        v.orderDetailList.map(item => {
                          // 判断出当前全部订单行数据是否包含除订单状态 为待接单状态 以及已关闭状态 ， 如果存在其他状态 不会显示整单分配按钮
                          if (item.orderStatus !== 'WAIT_ORDER_TAKING' && item.orderStatus !== 'CLOSE') {
                            allotFlag = false
                          } else {
                            // 判断订单行数据没有其他订单状态 只有待接单和已关闭状态  
                            if (allotFlag === null) {
                              // 查看数组中是否包含待接单状态，如果存在 则显示整单分配按钮，否则不显示
                              newOrderStatusArr = v.orderDetailList.filter(params => params.orderStatus === 'WAIT_ORDER_TAKING')
                              if (newOrderStatusArr && newOrderStatusArr.length > 0) {
                                allotFlag = true
                              } else {
                                allotFlag = false
                              }
                            }
                          }
                        })
                      }
                      return <tbody>
                        <tr style={{ background: '#f2f2f2' }}>
                          <td colSpan={9} >
                            <div style={{ display: "flex", padding: '0 30px 0 15px', justifyContent: 'space-between' }}>
                              <div style={{ display: 'flex', width: 500, justifyContent: 'space-between' }}>
                                <span >订单号：{v.orderId}</span>
                                <span >下单时间：{v.orderCreateTime}</span>
                              </div>
                              {/* <div >{"待分配"}</div> */}
                              <div style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }} >
                                {/* <TheButton onClick={() => { this.distributionModal(v.orderDetailList, 'whole', v) }}>整单分配</TheButton> */}
                                {allotFlag && <TheButton haspermi={['call:orderList:distributeAll']} onClick={() => { this.distributionModal(v, 'whole') }}>整单分配</TheButton>}
                                <TheButton haspermi={['call:orderList:viewDetails']} onClick={() => { this.props.history.push('/call/order/orderList/details/' + v.orderId) }}>查看订单</TheButton>
                              </div>
                            </div>
                          </td>
                        </tr>
                        {v.orderDetailList && v.orderDetailList.map((item, i) => {
                          let serviceType = '', orderStatus = '', allocationStatus = ''
                          let skuInfoValue = [] //规格信息数据值 规格值可能会存在多个 多个情况下、分隔显示
                          if (item.skuInfoObj) {
                            if (item.skuInfoObj.specValues) {
                              skuInfoValue = item.skuInfoObj.specValues.map(v => {
                                return v.specsValue
                              }).join('/')
                            }
                            if (item.skuInfoObj.serviceType) {
                              // 服务类型
                              switch (item.skuInfoObj.serviceType) {
                                case 'FEED':
                                  serviceType = '喂养'
                                  break
                                case 'CARE':
                                  serviceType = '洗护'
                                  break
                                default:
                                  serviceType = '-'
                              }
                            }
                          }
                          // 分配状态
                          switch (item.allocationStatus) {
                            case 'ASSIGNED':
                              allocationStatus = '已分配'
                              break
                            case 'NON_ASSIGNED':
                              allocationStatus = '待分配'
                              break
                            default:
                              allocationStatus = '-'
                          }
                          // 订单状态
                          switch (item.orderStatus) {
                            case 'WAIT_PAY':
                              orderStatus = '待付款'
                              break
                            case 'WAIT_ORDER_TAKING':
                              orderStatus = '待接单'
                              break
                            case 'WAIT_SERVICE':
                              orderStatus = '待服务'
                              break
                            case 'IN_PROCESS':
                              orderStatus = '服务中'
                              break
                            case 'FINISH':
                              orderStatus = '已完成'
                              break
                            case 'CLOSE':
                              orderStatus = '已关闭'
                              break
                            default:
                              orderStatus = '-'
                          }
                          return <tr style={{ textAlign: "center" }}>
                            <td style={{ display: 'block', width: 200, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
                              <Tooltip placement="top" title={
                                <div>
                                  <span>{serviceType}</span>
                                  <span style={{ margin: '0 5px' }}>|</span>
                                  <span>{skuInfoValue}</span>
                                </div>
                              } >
                                <span>{serviceType}</span>
                                <span style={{ margin: '0 5px' }}>|</span>
                                <span>{skuInfoValue}</span>
                              </Tooltip>
                            </td>
                            <td style={{ fontSize: 12 }}>
                              <span> {item.serviceDate}&nbsp;{item.serviceWeek}&nbsp;{item.serviceStartTime}~{item.serviceFinishTime} </span>
                              {item.orderDetailType === '1' && <Tag color="error">变更</Tag>}
                            </td>
                            <td><React.$Price price={item.orderAmount} /></td>
                            <td><React.$Price price={item.orderAmount} /></td>
                            {/* <td>{allocationStatus}</td> */}
                            <td> {item.allocationStatus === 'ASSIGNED' ? <TheButton onClick={() => { this.setState({ isServeListModal: true, orderDetailId: item.orderDetailId }) }}>已分配</TheButton> : allocationStatus}</td>
                            <td>{item.servicerName ? <TheButton onClick={() => { this.props.history.push('/call/servicer/servicerList/detail/' + item.servicerId + '/' + 'view') }}>{item.servicerName}</TheButton> : '-'}</td>
                            <td>  {item.salesReturnDetailList && item.salesReturnDetailList.length > 0 ? item.salesReturnDetailList.map(params => {
                              let refundStatus = '', path = '', changeStatus = '', btn = ''
                              //refundStatus 退款枚举值   path 跳转地址
                              switch (params.refundStatus) {
                                case '1':
                                  refundStatus = '待处理'
                                  break
                                case '2':
                                  refundStatus = '退款成功'
                                  break
                                case '3':
                                  refundStatus = '退款失败'
                                  break
                                case '0':
                                  refundStatus = '退款关闭'
                                  break
                                default:
                                  refundStatus = '-'
                              }
                              //changeStatus 售后枚举值
                              switch (params.changeStatus) {
                                case '1':
                                  changeStatus = '待处理'
                                  break
                                case '2':
                                  changeStatus = '变更成功'
                                  break
                                case '0':
                                  changeStatus = '变更关闭'
                                  break
                                default:
                                  changeStatus = '-'
                              }
                              switch (params.refundDetailType) {
                                case '0':
                                  btn = changeStatus
                                  path = `/call/order/afterSaleOrder/changeDetails/${params.salesReturnId}` //变更地址
                                  break
                                case '1':
                                  btn = changeStatus
                                  path = `/call/order/afterSaleOrder/changeDetails/${params.salesReturnId}` //变更地址
                                  break
                                case '2':
                                  btn = refundStatus
                                  path = `/call/order/afterSaleOrder/refundDetails/${params.salesReturnId}` //退款地址
                                  break
                              }
                              return <TheButton onClick={() => { this.afterSaleDetails(path) }}>{btn}</TheButton>
                            }) : <TheButton >-</TheButton>
                            }
                            </td>
                            <td>{orderStatus}</td>
                            <td> {item.orderStatus === 'WAIT_ORDER_TAKING' ?
                              <TheButton haspermi={['call:orderList:allocation']} onClick={() => { this.distributionModal(v.orderDetailList[i], 'single', v) }}>分配</TheButton> :
                              <TheButton >-</TheButton>}
                              {item.canNewAllocation && <TheButton haspermi={['call:orderList:aNewAllocation']} className='anewDistribution' onClick={() => this.anewDistribution(v.orderDetailList[i], 'single', v)}>重新分配</TheButton>}
                            </td>
                          </tr>
                        })}
                      </tbody>
                    })}
                  </table>
                  {
                    dataSource.length === 0 && < Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
                  }
                  <ThePagination
                    pageNo={pageNo}
                    pageSize={pageSize}
                    total={total}
                    pageChange={this.pageChange}
                  ></ThePagination>
                </Tabs.TabPane>
              )
            })
          }
        </Tabs>
        <Modal
          className='distributionServe'
          width={'70%'}
          title="分配服务者"
          open={isDurationModal}
          onOk={this.submitDistribution}
          destroyOnClose
          okText='确认分配'
          onCancel={() => { this.setState({ isDurationModal: false, selectServicerIds: [] }) }}>
          <DistributionServe getServerData={this.getServerData} orderId={orderId} orderDetailId={orderDetailId} allocationType={allocationType} getSelectKeys={this.selectServe} ></DistributionServe>
        </Modal>
        {/* 已分配信息弹窗 */}
        {
          isServeListModal && <ServeTableModal isModalOpen={isServeListModal} orderDetailId={orderDetailId} getServerListModal={this.getServerListModal}></ServeTableModal>
        }
        {/* <Modal width={'70%'} title="分配信息" open={isAllocationModal} onCancel={() => { this.setState({ isAllocationModal: false }) }} footer={null}>
          <DistributionServe orderId={orderId} orderDetailId={orderDetailId} allocationType={allocationType} type={true} ></DistributionServe>
        </Modal> */}
      </div >
    )
  }
}